<!DOCTYPE html>
<html ng-app="bb" ng-controller="MainController as mainCtrl">
  <head>
    <meta charset="utf-8" />
    <title ng-cloak ng-bind="appName"></title>

    <meta http-equiv="X-UA-Compatible" content="IE=9,chrome=1" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="fragment" content="!" />

    <link rel="icon" href="favicon.ico" mce_href="favicon.ico" type="image/x-icon">
    <link rel="apple-touch-icon-precomposed" href="favicon.ico"/>

    <!-- inject:css:before -->
    <link rel="stylesheet" href="css/app.min.css" />
    <!-- inject:css -->

    <!-- inject:js:before -->
  </head>
  <body ui-prevent-touchmove-defaults ontouchstart>

    <!-- Sidebars -->
    <div ng-include="'html/layout/sidebar.html'"
            ui-track-as-search-param='true'
            class="sidebar sidebar-left"></div>

    <div ng-include="'html/layout/sidebar_right.html'"
            class="sidebar sidebar-right"></div>

    <div class="app"
         ui-swipe-right="Ui.turnOn('uiSidebarLeft')"
         ui-swipe-left="Ui.turnOff('uiSidebarLeft')">

      <!-- Navbars -->
      <div class="navbar navbar-app navbar-absolute-top navbar-fixed-top">
        <div class="navbar-container">

          <div ng-class="{true:'navbar-brand', false:'navbar-brand navbar-brand-center'}[layout==1]" ui-yield-to="title"></div>
          <div ng-show="layout==2">
            <div class="btn-group pull-left">
              <div ui-toggle="uiSidebarLeft" class="btn sidebar-toggle">
                <i class="fa fa-bars"></i>
              </div>
            </div>
          </div>
          <div class="navbar-right-container">
            <div ng-show="layout==2" class="btn-group pull-right" ui-yield-to="navbarAction">
              <div ui-toggle="uiSidebarRight" class="btn">
                <i class="fa fa-coffee"></i>
              </div>
            </div>
            <div ng-show="layout==1" ng-include="'html/layout/navbar.html'"></div>
          </div>
        </div>
      </div>

      <!-- Mobile Angular UI的默认导航方式 -->
      <!-- <div class="navbar navbar-app navbar-absolute-bottom">
        <div class="btn-group justified">
          <a href="#/" class="btn btn-navbar"><i class="fa fa-home fa-navbar"></i> 首页</a>
          <a href="#/music" class="btn btn-navbar"><i class="fa fa-github fa-navbar"></i> 博客</a>
          <a href="#/news" class="btn btn-navbar"><i class="fa fa-exclamation-circle fa-navbar"></i> 发现</a>
          <a href="#/blog" class="btn btn-navbar"><i class="fa fa-github fa-navbar"></i> 我的</a>
        </div>
      </div> -->

      <div class="weui-tab">
        <div class="weui-tab__bd">
          <!-- App Body -->
          <div class="app-body" ng-class="{loading: loading}">
            <div ng-show="loading" class="app-content-loading">
              <i class="fa fa-spinner fa-spin loading-spinner"></i>
            </div>
            <div class="app-content">
              <ng-view></ng-view>
            </div>
          </div>
        </div>

        <div class="navbar navbar-app navbar-absolute-bottom">
          <div class="weui-tabbar">
            <a href="#index" class="weui-tabbar__item weui-bar__item--on">
              <div class="weui-tabbar__icon"><i class="fa fa-home fa-navbar"></i></div>
              <span class="weui-badge">8</span>
              <p class="weui-tabbar__label">首页</p>
            </a>
            <a href="#blog" class="weui-tabbar__item">
              <div class="weui-tabbar__icon"><i class="fa fa-paper-plane-o fa-navbar"></i></div>
              <p class="weui-tabbar__label">博客</p>
            </a>
            <a href="#lab" class="weui-tabbar__item">
              <div class="weui-tabbar__icon"><i class="fa fa-search fa-navbar"></i></div>
              <p class="weui-tabbar__label">发现</p>
            </a>
            <a href="#my" class="weui-tabbar__item">
              <div class="weui-tabbar__icon"><i class="fa fa-user fa-navbar"></i></div>
              <p class="weui-tabbar__label">我</p>
            </a>
          </div>
        </div>
      </div>

    </div><!-- ~ .app -->

    <div ui-yield-to="modals"></div>
    <script src="js/bower/bower.min.js"></script>
    <script src="js/app.min.js"></script>
    <!-- inject:js -->
  </body>
</html>
